@import '../../../variables';

.popular-widget {
    margin-bottom: 20px;
    color: @black;
    border: 1px solid @ansible-dark-grey;
    .popular-title {
        text-align: center;
        font-size: 16px;
        font-weight: 700;
        padding: 8px;
        border-bottom: 1px solid @ansible-dark-grey;
    }

    .list-wrapper {
        display: flex;
        justify-content: space-between;
        width: 100%;
        .item-name {
            font-weight: bold;
            padding: 2px 5px;
            border-radius: 1px;
            background-color: @blue;
            color: @white;
        }
        .item-name:hover {
            cursor: pointer;
        }
        .item-count {
            padding: 2px 4px;
            border-radius: 1px;
            color: @white;
            background-color: @ansible-dark-grey;
        }
    }
}
